
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <title>新增订单</title>
    <base>
    <link rel="stylesheet" href="../../../res/layui-v2.5.6/css/layui.css" media="all">
    <style type="text/css">
        body{
            margin:20px 0px;
        }
        .shuliang{
            margin:0;
            padding:0;
            border:0 none;
        }
        .beiz{
            margin:0;
            padding:0;
            border:0 none;
        }
        #goods{
            margin:0px 0px 0px 25px;
        }
        .demoTable{
            margin:0px 0px 0px 25px;
        }
    </style>
</head>
<body>
<fieldset class="layui-elem-field layui-field-title" style="margin-top: 20px;">
    <legend>新增订单</legend>
</fieldset>
<form class="layui-form" id="form" lay-filter="form">
    <div class="layui-form-item">
        <input type="hidden" name="purchaseId" id="purchaseId"/>
        <input type="hidden" name="immId" id="immId"/>
        <input type="hidden" name="operator" id="operator"/>

        <div class="layui-inline">
            <label class="layui-form-label">采购备注</label>
            <div class="layui-input-inline">
                <input type="text" name="remark" id="remark" required lay-verify="required"  placeholder="采购备注" maxlength="200" autocomplete="off" class="layui-input">
            </div>
        </div>
        <div class="layui-btn-group demoTable">
            <button class="layui-btn" data-type="getCheckData" id="add">一键全部添加</button>
        </div>
    </div>
</form>
<div class="layui-form" style="margin-left: 10px;margin-top: 30px;margin-right: 60px">
    <table id="goods" class="layui-table">
        <colgroup>
            <col width="150">
            <col width="150">
            <col width="200">
            <col width="200">
            <col>
        </colgroup>
        <thead>
        <tr>
            <th>采购药品名称</th>
            <th>物品数量</th>
            <th>物品备注</th>
            <th>采购价</th>
            <th>操作</th>
        </tr>
        </thead>
    </table>

</div>

<fieldset class="layui-elem-field layui-field-title" style="margin-top: 20px;">
    <legend>请勾选已下药品</legend>
</fieldset>

<div class="demoTable" style="margin-left: 35px">
    搜索：
    <div class="layui-inline">
        <input class="layui-input" name="drugName" id="drugName" autocomplete="off" placeholder="输入药品关键字">
    </div>
    药品类型：
        <div class="layui-input-inline">
            <div class="layui-form">
                <select name="typeName" id="typeName" autocomplete="off" lay-filter="aihao">
                    <option value=""></option>
                </select>
            </div>
        </div>

    范围：
    <div class="layui-inline">
        <div class="layui-input-inline" style="width: 100px;">
            <input type="text" name="priceMin" id="priceMin" oninput="value=value.replace(/[^\d]/g,'')" autocomplete="off" placeholder="￥" autocomplete="off" class="layui-input">
        </div>
        --
        <div class="layui-input-inline" style="width: 100px;">
            <input type="text" name="priceMax" id="priceMax" oninput="value=value.replace(/[^\d]/g,'')" autocomplete="off" placeholder="￥" autocomplete="off" class="layui-input">
        </div>
    </div>
    <button class="layui-btn" data-type="reload" onclick="seach(this)">搜索</button>
</div>

<div style="margin-top: 20px;margin-left: 35px;margin-right: 35px">
    <table class="layui-table" id='cx' lay-filter="test"></table>

    <script type="text/html" id="barDemo">
        <a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="del">删除</a>
    </script>


    <script type="text/javascript" src="../../../res/layui-v2.5.6/layui.js"></script>
    <script type="text/javascript" src="../../../res/js/jquery-3.4.1.min.js"></script>
    <script>
        /**
         得到地址栏的参数
         */
        function getQueryString(name) {
            var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)");
            var r = window.location.search.substr(1).match(reg);
            if (r != null) return unescape(r[2]);
            return null;
        }
    </script>
    <script>
        var arr = "";
        var array = new Array();
        var ids = null;
        //全选之后的删除。删除goods表格的数据
        function show(obj) {
            var oDivs = obj.parentNode.parentNode;
            //console.info(oDivs.firstChild.innerHTML);//删除的id
            $.each(array, function (index, item) {
                if (item === oDivs.firstChild.innerHTML) {
                    array.splice(index, 1)
                }
            });
            obj.parentNode.parentNode.parentNode.removeChild(oDivs);
            table.reload('testRe');
        }
        // oninput="()"
        function keyPress() {
            var keyCode = event.keyCode;
            if ((keyCode >= 48 && keyCode <= 57))
            {
                event.returnValue = true;
            } else {
                event.returnValue = false;
            }
        }
        var form = null;
        var laydate = null;
        layui.use(['form','laydate', 'laypage', 'layer', 'table', 'upload', 'element'], function(){
             laydate = layui.laydate //日期
            var laypage = layui.laypage //分页
            layer = layui.layer //弹层
                ,table = layui.table //表格
                ,upload = layui.upload //上传
                ,element = layui.element; //元素操作
                form = layui.form;

            //监听Tab切换
            element.on('tab(demo)', function(data){
                layer.msg('切换了：'+ this.innerHTML);
                console.log(data);
            });
            //执行一个 table 实例
            table.render({
                elem: '#cx'
                ,url: '/hqDrug/fqueryAll' //数据接口
                ,page: true //开启分页
                ,method:'post'
                ,size:'sm'
                ,cols: [[ //表头
                    {type:'checkbox',fixed: 'left'}
                    ,{field: 'drugId', title: '药品ID', width:120, fixed: 'left'}
                    ,{field: 'images', title: '药品图片', width:120,templet:'<div><img src="{{ d.images}}"></div>'}
                    ,{field: 'drugName', title: '药品名称', width:150}
                    ,{field: 'drugWho', title: '价格', width: 120}
                    ,{field: 'typeName', title: '药品类型', width: 120}
                    , {field: 'drugExp', title: '药品说明', width: 180}
                    , {field: 'taboo', title: '主要用药禁忌', width: 120}
                    , {field: 'alias', title: '别名', width: 120}
                ]]
                ,id: 'testRe'
                , parseData: function (res) {//res 即为原始返回的数据
                    ids = res.data;
                    $("#goods tr").each(function () {
                         var td = $(this).find("td");
                         if ($(td[0]).text()!==""){
                             array.push($(td[0]).text())
                         }
                    });
                    for (var i in res.data) {
                        for (var j = 0; j < array.length; j++) {
                            if (array[j] === res.data[i].drugId) {
                                //如果set集合中有的话，给rows添加check属性选中
                                res.data[i]["LAY_CHECKED"] = true;
                            }
                        }
                    }
                    return {
                        "code": res.code, //解析接口状态
                        "count": res.count, //解析数据长度
                        "data": res.data //解析数据列表
                    };
                }
            });

            layui.use('table', function(){
                var table = layui.table;
                table.on('checkbox(test)', function(obj){
                    //alert(obj.type);
                    //得到id为goods的表格的数据
                    var oCar = document.getElementById("goods");
                    //全选
                    if(obj.type=="all"){
                        //获取选中状态
                        if(obj.checked==true){
                            var checkStatus = table.checkStatus('testRe')
                                , data = checkStatus.data;
                            for (let i = 0; i < data.length; i++) {
                                //删除全选之前的单选
                                $.each(array,function(index,item){
                                    if (data[i].drugId===item){
                                        array.splice(index, 1);
                                    }
                                });
                                array.push(data[i].drugId);
                            }
                            //alert(JSON.stringify(table));
                            //得到该表格的所有数据
                            var one=table.cache.testRe;
                            //得到id为goods的表格.得到该表格tr的值
                            var tr=oCar.getElementsByClassName("iii");
                            //得到tr的长度
                            var len = tr.length;
                            //判断当长度为0时，点击全选将数据全部加入进去
                            if(len==0){
                                //for 根据one 表格的长度循环  取数据
                                for(var i=0;i<one.length;i++){
                                    //新增一个tr的节点
                                    var oDiv= document.createElement("tr");
                                    //设置tr的class为trs
                                    oDiv.className = "trs";
                                    //加入数据
                                    oDiv.innerHTML +='<td style="display:none">'+one[i].drugId+'</td>'
                                    oDiv.innerHTML +='<td class="iii">'+one[i].drugName+'</td>'
                                    oDiv.innerHTML +='<td><input type="text" class="shuliang" style="ime-mode:disabled;" onpaste="return false;"  onkeypress="keyPress()" maxlength="4" oninput="value=value.replace(/[^\\d]/g,\'\')"></td>'
                                    oDiv.innerHTML +='<td><input type="text" class="beiz" maxlength="200"></td>'
                                    oDiv.innerHTML +='<td>'+one[i].drugWho+'</td>'
                                    oDiv.innerHTML +='<td><a href="javascript:;" onclick="show(this)">删除</a></td>'
                                    //将数据加入表格中
                                    oCar.appendChild(oDiv);
                                    /* var delBtn = oDiv.lastChild;
                                      delBtn.onclick=function(){
                                          oCar.removeChild(oDiv);
                                      } */
                                }
                                //否则
                            }else{
                                //for 根据one 表格的长度循环 取数据
                                for(var i=0;i<one.length;i++){
                                    //设置一个常量
                                    var st="";
                                    //for 循环id为goods表格的数据
                                    for(j=0;j<len;j++){
                                        //得到点击选中药品的名字
                                        var ii=one[i].drugName;
                                        //得到表格id为goods药品的名字
                                        var uu=tr[j].innerHTML;
                                        //判断当选中药品的名字和goods表格中药品名字为一致时
                                        if(ii==uu){
                                            //将变量st添加 "已有该数据"；
                                            st="已有该数据";
                                            //跳出循环
                                            break;
                                        }
                                    }
                                    //如果变量st等于 "已有该数据"，则提示已有该数据
                                    if(st=="已有该数据"){

                                        //否则
                                    }else{
                                        //新增一个tr的节点
                                        var oDiv = document.createElement("tr");
                                        //设置tr的class为trs
                                        oDiv.className = "trs";
                                        //加入数据
                                        oDiv.innerHTML +='<td style="display:none">'+data[i].drugId+'</td>'
                                        oDiv.innerHTML +='<td class="iii">'+one[i].drugName+'</td>'
                                        oDiv.innerHTML +='<td><input type="text" class="shuliang" style="ime-mode:disabled;" onpaste="return false;"  onkeypress="keyPress()" maxlength="4" oninput="value=value.replace(/[^\\d]/g,\'\')"></td>'
                                        oDiv.innerHTML +='<td><input type="text" class="beiz" maxlength="200"></td>'
                                        oDiv.innerHTML +='<td>'+one[i].drugWho+'</td>'
                                        oDiv.innerHTML +='<td><a href="javascript:;" onclick="show(this)">删除</a></td>'
                                        //将数据加入表格中
                                        oCar.appendChild(oDiv);
                                        //得到新加节点的最后的一个a标签的
                                        /* var delBtn = oDiv.lastChild.getElementsByTagName("a")[0];
                                         //当点击a标签时触发该事件
                                           delBtn.onclick=function(){
                                             //将这个节点删除
                                               oCar.removeChild(oDiv);
                                           } */
                                    }
                                }
                            }
                        }else {
                            var auto = $('.trs');
                            $.each(auto, function (index, item) {
                                for (let j = 0; j < ids.length; j++) {
                                    console.info(item.firstChild.innerHTML)
                                    if (ids[j].drugId === item.firstChild.innerHTML) {
                                        item.remove();
                                    }
                                }
                            }, "json");
                            for (let i = 0; i < ids.length; i++) {
                                for (let j = 0; j < array.length; j++) {
                                    if (ids[i].drugId === array[j]) {
                                        array.splice(j, 1);
                                    }
                                }
                            }
                        }
                        //单选
                    }else if(obj.type=="one"){
                        //获取选中状态
                        if(obj.checked==true){
                            //得到所在行所有键值
                            data = obj.data;
                            array.push(obj.data.drugId);
                            console.info(array)
                            //alert(JSON.stringify(obj.data));
                            //得到id为goods的表格.得到该表格tr的值
                            var tr=oCar.getElementsByClassName("iii");
                            //得到tr的长度
                            var len = tr.length;
                            //判断当长度为0时，点击选中将数据全部加入进去
                            if(len==0){
                                //新增一个tr的节点
                                var oDiv = document.createElement("tr");
                                //设置tr的class为trs
                                oDiv.className = "trs";
                                //加入数据
                                oDiv.innerHTML +='<td style="display:none">'+data.drugId+'</td>'
                                oDiv.innerHTML +='<td class="iii">'+data.drugName+'</td>'
                                oDiv.innerHTML +='<td><input type="text" class="shuliang" style="ime-mode:disabled;" onpaste="return false;"  onkeypress="keyPress()" maxlength="4" oninput="value=value.replace(/[^\\d]/g,\'\')"></td>'
                                oDiv.innerHTML +='<td><input type="text" class="beiz" maxlength="200"></td>'
                                oDiv.innerHTML +='<td>'+data.drugWho+'</td>'
                                oDiv.innerHTML +='<td><a href="javascript:; " onclick="show(this)">删除</a></td>'
                                //将数据加入表格中
                                oCar.appendChild(oDiv);
                                //得到新加节点的最后的一个a标签的
                            }else{
                                //for 循环id为goods表格的数据
                                for(i=0;i<len;i++){
                                    //得到点击选中药品的名字
                                    var sj=tr[i].innerHTML;
                                    //得到表格id为goods药品的名字
                                    var oo=data.drugName;
                                    //设置一个变量
                                    var st="";
                                    //判断当选中药品的名字和goods表格中药品名字为一致时
                                    if(sj==oo){
                                        //将变量st添加 "已有该数据"；
                                        st="已有该数据";
                                        //跳出循环
                                        break;
                                    }
                                }
                                //如果变量st等于 "已有该数据"，则提示已有该数据
                                if(st=="已有该数据"){
                                    layer.msg('亲，你点击的药品已经加入过了!!!', {
                                        icon: 5,
                                        time: 1500 //1秒关闭（如果不配置，默认是3秒）
                                    }, function(){

                                    });
                                    //否则
                                }else{
                                    //新增一个tr的节点
                                    var oDiv = document.createElement("tr");
                                    //设置tr的class为trs
                                    oDiv.className = "trs";
                                    //加入数据
                                    oDiv.innerHTML +='<td style="display:none">'+data.drugId+'</td>'
                                    oDiv.innerHTML +='<td class="iii">'+data.drugName+'</td>'
                                    oDiv.innerHTML +='<td><input type="text" class="shuliang" style="ime-mode:disabled;" onpaste="return false;"  onkeypress="keyPress()" maxlength="4" oninput="value=value.replace(/[^\\d]/g,\'\')"></td>'
                                    oDiv.innerHTML +='<td><input type="text" class="beiz" maxlength="200"></td>'
                                    oDiv.innerHTML +='<td>'+data.drugWho+'</td>'
                                    oDiv.innerHTML +='<td><a href="javascript:;" onclick="show(this)">删除</a></td>'
                                    //将数据加入表格中
                                    oCar.appendChild(oDiv);
                                }
                            }
                        }else {
                            var auto = $('.trs');
                            $.each(auto, function (index, item) {
                                if (obj.data.drugId === item.firstChild.innerHTML) {
                                    item.remove();
                                }
                            }, "json");
                            for (let i = 0; i < array.length; i++) {
                                if (obj.data.drugId === array[i]) {
                                    array.splice(i, 1);
                                }
                            }
                        }
                    }
                });
                var $ = layui.$;
                //当点击一键添加的时候
                var s = 0;
                $('#add').on('click', function(){
                    s++;
                    if(s === 1){
                        //从Session中获取用户信息
                        var users = window.localStorage.getItem("users");
                        var date = JSON.parse(users);
                        //如果是总公司则不能增加
                        if(date.companyId=="0"){
                            layer.msg('对不起,总公司账号没有采购药品功能');
                            return false;
                        }

                        //得到订单表的审核备注
                        var remark = $("#remark").val();
                        //得到goods表格的数据
                        var number=0;
                        //设置一个数组
                        var arr = [];
                        //得到goods表格的数据
                        $("#goods tr").each(function(){
                            if(number>0){
                                var row = "";
                                var td = $(this).find("td");
                                row={
                                    "drugId":$(td[0]).text(),
                                    "count":$(td[2]).children().val(),
                                    "remark":$(td[3]).children().val(),
                                    "money":$(td[4]).text()};
                                //将数据加入进去
                                arr.push(row);
                            }
                            number=number+1;
                        });
                        //转换json数据
                        var arrs = JSON.stringify(arr);
                        var reg = new RegExp("^[0-9]*$");
                        var num = 0;
                        $.each(arr, function (index, item) {
                            if (!reg.test(item.count) || item.count == '') {
                                num = num + 1;
                            }
                        }, "json");
                        console.info(arr);

                        if (arrs == '[]') {
                            layer.msg('请添加至少一种药品');
                        }else if (remark == "") {
                            layer.msg('请输入采购备注');
                        }else if (num > 0) {
                            layer.msg('请检查物品数量是否有误');
                        }else {
                            var formData = new FormData(document.getElementById("form"));
                            formData.append("arr", arrs);
                            //通过ajax方式传入到后台
                            $.ajax({
                                traditional:true,
                                url:'/immPurchase/editAdd',
                                data:formData,
                                type: "post",
                                dataType:"json",
                                processData: false,
                                contentType: false,
                                cache:false,
                                async: false,
                                success: function(obj){
                                    if(obj.status == 20){
                                        //关闭弹窗刷新页面
                                        parent.closeOpen(obj.message);
                                    }else{
                                        parent.closeOpen(obj.message);
                                    }
                                }
                            });
                        }
                        return false;
                    }
                });
                //监听单元格编辑
                table.on('edit(demo)', function(obj){
                    var value = obj.value //得到修改后的值
                        ,data = obj.data //得到所在行所有键值
                        ,field = obj.field; //得到字段
                    var count;
                    var remark;
                    //当编辑的是数量时，判断它只能是数字
                    if(field=="count"){
                        var reg = new RegExp("^[0-9]*$");
                        if(reg.test(value)){
                            count=value;
                            remark=data.remark;
                        }else {
                            //提示只能输入数字
                            layer.msg('输入的内容不能含有字母或文本', {
                                icon: 1,
                                time: 1000 //1秒关闭（如果不配置，默认是3秒）
                            }, function(){
                                table.reload('testReload',{page:{curr:1}});
                            });
                            return;
                        }
                        //判断是物品备注时
                    }else if(field=="remark"){
                        remark=value;
                        count=data.count;
                    }
                    var fdPodId=data.fdPodId;
                    var money=data.money;
                    //通过ajax方法传入到后台
                    $.ajax({
                        url:"../../FdPoBreakdown/update.action",
                        data:{"fdPodId":fdPodId,"money":money,"remark":remark,"count":count},
                        type: "post",
                        dataType:"json",
                        cache:false,
                        async: false,
                        success: function(obj){
                            //修改成功后刷新该表格
                            table.reload('testReload',{
                                page: {
                                    curr: 1 //重新从第 1 页开始
                                }
                            });
                        }
                    });
                });
            });
            //根据id删除数据
            table.on('tool(demo)', function(obj){ //注：tool是工具条事件名，test是table原始容器的属性 lay-filter="对应的值"
                var data = obj.data //获得当前行数据
                    ,layEvent = obj.event; //获得 lay-event 对应的值
                if(layEvent === 'del'){
                    var id=data.fdPodId;

                    layer.confirm('确认删除？', function(index){
                        obj.del(); //删除对应行（tr）的DOM结构
                        layer.close(index);
                        //使用jquery的ajax方式向后台提交数据
                        var url = "../../FdPoBreakdown/delete.action";
                        var data={fdPodId:id};
                        $.post(url,data,function(data){

                            if(data=="ok"){
                                layer.msg('删除成功', {
                                    icon: 1,
                                    time: 1000 //1秒关闭（如果不配置，默认是3秒）
                                }, function(){

                                });
                                table.reload('testReload',{
                                    page: {
                                        curr: 1 //重新从第 1 页开始
                                    }
                                });
                            }

                        });
                    });
                }
            });
            //条件查询
            var $ = layui.$;



            //下拉框赋值
            $.ajax({
                async:false,
                url: '/hqDrugtype/fqueryAll',
                data: '',
                processData: false,
                contentType: false,
                dataType: 'json',
                type: 'GET',
                success: function (obj) {
                    $.each(obj,function(index,item){
                        $("#typeName").append(
                            `<option value=${item.typeId}>`+item.typeName+`</option>`
                        );
                    });
                    //重新渲染
                    form.render("select");
                },
                error: function () {

                }
            });

            //表单赋值
            var purchaseId = getQueryString("id");
            if (purchaseId) {
                var url = "/immPurchase/queryByPurchaseId/"+purchaseId;
                $.ajax({
                    async: false,
                    url: url,
                    dataType: 'json',
                    type: 'GET',
                    success: function (obj) {
                        console.info(obj);
                        form.val('form',obj);
                        $.each(obj.immPurchaseDeatisList,function(index,item){
                            //新增一个tr的节点
                            var oDiv = document.createElement("tr");
                            //设置tr的class为trs
                            oDiv.className = "trs";
                            //加入数据
                            oDiv.innerHTML +='<td style="display:none">'+item.drugId+'</td>'
                            oDiv.innerHTML +='<td class="iii">'+item.drugName+'</td>'
                            oDiv.innerHTML +='<td><input type="text" class="shuliang" oninput="value=value.replace(/[^\\d]/g,\'\')" style="ime-mode:disabled;" onpaste="return false;"  onkeypress="keyPress()" maxlength="4" value='+item.count+'></td>'
                            oDiv.innerHTML +='<td><input type="text" class="beiz" maxlength="200" value='+item.remark+'></td>'
                            oDiv.innerHTML +='<td>'+item.money+'</td>'
                            oDiv.innerHTML +='<td><a href="javascript:;" onclick="show(this)">删除</a></td>'
                            //将数据加入表格中
                            var oCar = document.getElementById("goods");
                            oCar.appendChild(oDiv);
                        })
                    },
                    error: function () {

                    }
                });

            }

        });


        function seach() {
            var drugName = $("#drugName").val();
            var typeName = $("#typeName").val();
            var priceMin = $("#priceMin").val();
            var priceMax = $("#priceMax").val();
            //执行重载
            table.reload('testRe', {
                page: {
                    curr: 1 //重新从第 1 页开始
                }
                ,where: {
                    drugName: drugName,
                    typeName: typeName,
                    priceMin: priceMin,
                    priceMax: priceMax
                }
            });
        }
    </script>
</div>
</body>
</html>